<template>
	<view>
		<view class="img-box">
			<image class="save-img" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-aliyun-ykv1vkf5qdf020b3c1/38b7e66e-4f1c-4909-8128-e009ae8903df.png" mode=""></image>
			<input type="text" value="" class="Uinput" />
		</view>
		<view class="btn">
			<button type="default" class="btn1" @click="btnSearch">查询</button>
		</view>
		<view class="txt-bao">
			<text>鉴别 ID 在鉴别报告下方</text>
		</view>
		<view class="note" :class="show ? 'isShow':''">
			<text>系统升级中，暂时无法查询，敬请期待！</text>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				show: true
			}
		},
		methods: {
			btnSearch() {
				let that = this
				this.show = false;
				setTimeout(function() {
					that.show = true
				}, 5000)
			}
		}
	}
</script>

<style lang="scss" scoped>
.img-box {
	position: relative;
	width: $uni-width;
	.save-img {
		width: $uni-width;
		height: 720rpx;
	}
	.Uinput {
		position: absolute;
		top: 593rpx;
		left: 39rpx;
		width: 672rpx;
		height: 86rpx;
		font-size: 36rpx;
		z-index: 10;
		text-align: center;
	}
}
.btn {
	margin-top: 80rpx;
	text-align: center;
	.btn1 {
		width: 350rpx;
		height: 100rpx;
		line-height: 100rpx;
		background-color: #00c2c3;
		color: white;
		font-size: 44rpx;
		font-weight: 600;
		letter-spacing: 8rpx;
		border-radius: 0px;
	}
}
.txt-bao {
	margin-top: 14rpx;
	text-align: center;
	color: #aeaebe;
}
.note {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 400rpx;
	padding: 20rpx;
	margin: 0 auto;
	font-size: 22rpx;
	text-align: center;
	background-color: #000;
	opacity: 0.8;
	color: white;
}
.isShow {
	display: none;
}

</style>
